import React from 'react'
import "./style.less"
import { setCity } from "../../../redux/actions/city"

export default function CityList ({ dispatch }) {

  const cityLists = ["北京", "上海", "深圳", "广州", "赤峰", "呼和浩特", "河北", "河南", "郑州", "西安", "沈阳", "成都", "天津", "南京", "杭州"]

  function clickHandle (city) {
    dispatch(setCity(city));
    window.history.back();
  }
  return (
    <div className="city-list-container">
      <h3>热门城市</h3>
      <ul>
        {
          cityLists.map((ele, index) => {
            return (
              <li key={index} onClick={() => { clickHandle(ele) }}>
                <span>{ele}</span>
              </li>
            )
          })
        }
      </ul>
    </div>
  )
}
